<script lang="tsx" setup>
/**
 * 实施管理-项目管理-项目需求
 */
import {convertEnumToList, definePageModel, DialogForm, PageModel, processRequest} from "@/framework/index.ts";
import {nextTick, ref} from "vue";
import {ElMessage, ElMessageBox} from "element-plus";
import APIS from "@/apis";
import {ImplementItemStatusEnum} from "@/pages/develop-project/develop-project-implement/index.ts";

/**
 * 显示
 */
const dialogFormRef = ref()
const dialogFormModel = {
  title: "项目需求",
  width: "1500px"
}


/**
 * 页面基础
 */
const pageModelRef = ref()
const config = definePageModel<any>({
  url:APIS.DEVELOP_PROJECT_IMPLEMENT_DEMAND_BASE,
  otherParams: {
    projectId: null
  },
  searchForm: {
    beforeSubmit(data) {
      if (data.endTime) {
        data.endTime += " 23:59:59"
      }
      return data
    },
    els: [
      {
        eType: "el-input",
        prop: "demand",
        props: {
          placeholder: "项目需求编码/名称",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "project",
        props: {
          placeholder: "项目管理编码/名称",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "content",
        props: {
          placeholder: "需求内容",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "implementStaffName",
        props: {
          placeholder: "实施人名称",
          clearable: true
        }
      },
      {
        eType: "el-select",
        prop: "implementItemStatus",
        props: {
          placeholder: "实施状态",
          clearable: true
        },
        optionsData: {
          list: convertEnumToList(ImplementItemStatusEnum),
          label: "label",
          value: "value"
        }
      },
      {
        eType: "el-date-picker",
        prop: "startTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-起始",
          clearable: true
        }
      },
      {
        eType: "el-date-picker",
        prop: "endTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-结束",
          clearable: true
        }
      },
    ]
  },
  programForm: {
    els: [
      {
        label: "测试",
        eType: "el-button",
        props: {
          type: "primary",
        },
        event: "test-multi"
      },
      {
        label: "发布",
        eType: "el-button",
        props: {
          type: "primary",
        },
        event: "release-multi"
      },
      {
        label: "完成",
        eType: "el-button",
        props: {
          type: "primary",
        },
        event: "finish-multi"
      },
    ]
  },
  table: {
    page: {
      enable: true,
      pageSize: 20
    },
    selection: true,
    props: {
      stripe: true,
      border: true
    },
    els: [
      {
        label: "需求编码",
        prop: "code",
        minWidth: 120
      },
      {
        label: "需求名字",
        prop: "name",
        minWidth: 120,
      },
      {
        label: "需求内容",
        prop: "content",
        minWidth: 120,
      },
      {
        label: "备注",
        prop: "remark",
        minWidth: 160,
      },
      {
        label:"实施状态",
        prop:"status",
        minWidth:120,
        renderFn(data) {
          return <span>{ImplementItemStatusEnum[data.implementItemStatus]}</span>
        },
      },
      {
        label: "创建人姓名",
        prop: "createStaffName",
        minWidth: 120,
      },
      {
        label: "创建时间",
        prop: "createTime",
        minWidth: 140,
        renderFn(data) {
          return <span>{data.createTime?.toDate()}</span>
        },
      }
    ]
  },
})

/**
 * 刷新
 */
const handleRefresh = (clear: boolean = false) => {
  pageModelRef.value.refreshTableData()
  clear && pageModelRef.value.clearSelection()
}

/**
 * 显示
 */
const projectId = ref()
const show = (params: { id: string }) => {
  dialogFormRef.value.show()
  projectId.value = params.id
  if (config.otherParams) {
    config.otherParams.projectId = params.id
  }
  nextTick(() => {
    handleRefresh(true)
  })
}

/**
 * 取消
 */
const handleClose = () => {
  dialogFormRef.value.close()
}

/**
 * 暴露
 */
defineExpose({
  show
})

/**
 * 测试 - 批量
 */
const handleTestMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.implementItemStatus !== ImplementItemStatusEnum['待测试']);
  if (list) {
    ElMessage.warning("只有待测试的项目才可以测试");
    return false;
  }
  await ElMessageBox.confirm("是否确认","确认",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectImplement/TestMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}

/**
 * 发布 - 批量
 */
const handleReleaseMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.implementItemStatus !== ImplementItemStatusEnum['待发布']);
  if (list) {
    ElMessage.warning("只有待发布的项目才可以测试");
    return false;
  }
  await ElMessageBox.confirm("是否确认","确认",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectImplement/ReleaseMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}

/**
 * 完成 - 批量
 */
const handleFinishMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.implementItemStatus !== ImplementItemStatusEnum['已完成']);
  if (list) {
    ElMessage.warning("只有已完成的项目才可以测试");
    return false;
  }
  await ElMessageBox.confirm("是否确认","确认",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectImplement/FinishMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}
</script>

<template>
  <DialogForm ref="dialogFormRef" :dialogFormModel="dialogFormModel">
    <div class="order-detail">
      <div class="order-table">
        <page-model ref="pageModelRef" :PageModel="config" @test-multi="handleTestMulti" @release-multi="handleReleaseMulti"
                    @finish-multi="handleFinishMulti"/>
      </div>
      <div class="order-button">
        <el-button @click="handleClose">关闭</el-button>
      </div>
    </div>
  </DialogForm>
</template>

<style lang="scss" scoped>
.order-detail {
  height: 650px;
  display: flex;
  flex-direction: column;

  .order-table {
    flex: 1;
    display: flex;
    flex-direction: column;
  }

  .order-button {
    text-align: right;
    flex: 0;
  }
}
</style>